<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="xdz" uri="/xdztools" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>新增用户</title>

<link href="${xdz:domain() }/css/bootstrap.min.css" rel="stylesheet">
<link href="${xdz:domain() }/css/font-awesome.min.css" rel="stylesheet">
<link href="${xdz:domain() }/css/animate.min.css" rel="stylesheet">
<link rel="stylesheet" href="${xdz:domain() }/css/parsley.css" >
<script src="${xdz:domain() }/js/jquery.min.js"></script>
<script src="${xdz:domain() }/js/bootstrap.min.js"></script>
<script src="${xdz:domain() }/js/plugins/parsley/parsley.min.js"></script>
<script src="${xdz:domain() }/js/plugins/parsley/zh_cn.js"></script>
<script src="${xdz:domain() }/js/app.js"></script>
<script src="${xdz:domain() }/js/app.plugin.js"></script>
<script src="${xdz:domain() }/js/app.data.js"></script>
<script src="${xdz:domain() }/js/jquery.md5.js"></script>
</head>
<body>
    <form action="../systemUserBase/insert" class="form-horizontal" id="systemUserBaseForm" method="post" data-parsley-validate onsubmit="checkForm()">
       <div class="panel panel-default">
	    	<div class="panel-heading">
	            <div class="panel-title">用户新增维护</div>
	   		</div>
            <div class="panel-body">      
           		<input type="hidden"  name="passwordEncrypt" id="passwordEncrypt"> 
           		<input type="hidden"  name="img" id="img" value="../images/tx.jpg"> 
                   <div class="form-group">
                       <label class="col-md-2 control-label">用户类型</label>
                       <div class="col-md-8">
                       	<select name="userType" id="userType" class="bg-focus form-control" required="required">
							<option value="1">系统用户</option>
						</select>
                       </div>
                   </div>        
                <div class="form-group">
                       <label class="col-md-2 control-label">头像</label>
                       <div class="col-md-8">
                          	<img alt="头像" style="width:50px" class="img-circle" src="../images/tx.jpg">
                       </div>
                </div>            
               	<div class="form-group">
                       <label class="col-md-2 control-label">昵称</label>
                       <div class="col-md-8">
                           <input type="text" name="userName" placeholder="" id="userName" class="bg-focus form-control" required="required">
                       </div>
                   </div>
                   <div class="form-group">
                       <label class="col-md-2 control-label">账户名</label>
                       <div class="col-md-8">
                           <input type="text" name="account" placeholder="" id="account" class="bg-focus form-control" required="required" autocomplete="off"
                           	data-parsley-required="true"
							data-parsley-trigger="focusout"
							data-parsley-required-message="账户名不可为空"
							data-parsley-minlength="3"
							data-parsley-minlength-message="账户名不可少于3位"
							data-parsley-maxlength="16"
							data-parsley-maxlength-message="账户名不可多于16位"
							data-parsley-pattern="^[a-zA-Z0-9_]+$"
							data-parsley-pattern-message="账户名只能包含大小写字母、数字和下划线">
                       </div>
                   </div>
                   <div class="form-group">
                       <label class="col-md-2 control-label">密码</label>
                       <div class="col-md-8">
                           <input type="password" placeholder="" id="password1" class="bg-focus form-control" required="required" autocomplete="off"
                           	data-parsley-required="true"
							data-parsley-trigger="focusout"
							data-parsley-required-message="密码不可为空"
							data-parsley-minlength="8"
							data-parsley-minlength-message="密码不可少于8位"
							data-parsley-maxlength="25"
							data-parsley-maxlength-message="密码不可多于25位"
							data-parsley-pattern="(?=(?:.*?\d){1})(?=.*[a-z])(?=(?:.*?[A-Z]){1})(?!.*\s)[0-9a-zA-Z!@#$%*()_+^&]*$"
							data-parsley-pattern-message="密码必须包含至少1个数字，1个大写字母和一些小写字母">
                       </div>
                   </div>
               	<div class="form-group">
                       <label class="col-md-2 control-label">所属角色</label>
                       <div class="col-md-8">
							<c:forEach var="i" items="${roleList}" varStatus="a">
							 	<div class="checkbox checkbox-inline checkbox-primary">
									<input type="checkbox" id="i${a.count }" name="userRole" value="${i.roleId}" /> ${i.roleName }
								</div>
							</c:forEach>
                       </div>
                   </div>
                   
                  <div class="form-group">
                   <label class="col-md-2 control-label"></label>
	                <div class="col-md-8 col-md-offset-1">
	                  <button type="submit" class="btn btn-primary">保存</button>
	                  <button type="button" class="btn btn-white" onclick="back()">取消</button>
	                </div>
	            </div>
            </div>
        </div>
    </form>
	<script type="text/javascript">
    function back(){
        history.go(-1);
    }
    $('#userRole').multiSelect({
    	selectableHeader: '可选角色：',
    	selectionHeader: '已选角色：'
    });
	function checkForm(){
		var password = $("#password1").val();
		if(password != "")
   	 		$("#passwordEncrypt").val(hex_md5(password));
	}

    </script>
</body>
</html>
